☄ EXPOLORE MIND ⚜ Tutorial ? JIQA Biography News
PRV MENU NEXT

Adding Plain Text to an HTML Web page

19-01-18 Course- HTML5-Simple

Hyper Text Markup Language (HTML) describes the structure of text-based information on a Web page by marking the text as headings and paragraphs. The basic text-formatting tags in HTML are <br>, <p>, and <hr>, which are used to add text in a new line, create paragraphs, and insert horizontal rules, respectively. HTML also provides tags to apply various styles to the text, such as <font>, <b>, and <i>. The <font> tag defines the size, face, and color of the text; whereas, <b> and <i> tags are used to apply the hold and italic syles to the text. In addition to this, HTML provides elements such as subscript, superscript, and blockquotes that can be used to enhance the look of the text on a Web page. Subscript and superscript can be used to write mathematical expressions, such as E-mc2 or chemical formulas, such as H2O; whereas, blockquotes can be used to indicate a quoted text.

You can also add the scrolling effect to the text with the use of the marquee tag, which animates the text on a Web page to highlight important information. Apart from this, characters such as greater than (>) and less than (<), which are reserved characters in HTML can be displayed on a Web page using the character entities.

In this tutorial, you learn how to work with text in HTML. The chapter further explains how to add plain text, create headings and paragraphs, add a horizontal rule, and create a subscript and superscript on a Web page. You also learn to align text, format and group text, specify font, indent quotations, display text in a scrolling marquee, work with character entities, and comment the text.

Let’s first start with adding plain text to an HTML page.

Adding Plain Text to an HTML Web Page 

Text can be added to an HTML, document by typing between the <body> tags of the HTML document. If you enter plain text in an HTML document, the Web browser displays the text in its default font, color, and size.

HTML recognizes only single spaces between characters. This means that if there are more than single space between the characters, HTML does not recognize it. Even if you type the text in a different line in Notepad HTML considers it as a single space and displays the text in the same line on the Web page.

Lets’ perform the following steps to add plain text to an HTML Web page:

Open a blank document n Notepad and add the code, given in below:


<!DOCTYPE html>
<head>
<title> Adding Plain Text </title>
</head>
<body>
This is an example of adding plain text to your web page. 
The text is supposed to be in different lines.
The text in the web page appears in the same line.
</body>
</html>

Save the document with an appropriate name and .html extension. In our case, we have named the HTML document as AddingPlainText.html.

Open the HTML document in Internet Explorer, as shown below:


This is an example of adding plain text to your web page. The text is supposed to be in different lines. The text in the web page appears in the same line.

Let’s now learn to insert text in a new line.

Adding Text in a New Line

As already learned, HTML does not recognize a page break simply by pressing the Enter key. The <br> tag in the HTML code inserts a line break in the text. The browser identities a <br> tag as a line break and displays the text that follows in a new line on the Web page.

Let’s do the following steps to insert a line break:

Open a blank document in Notepad and add the code:


<!DOCTYPE html>
<head>
<title> Inserting Line Break </title>
</head>
<body>
This is an example of inserting a line break
<br>
This line will come in a separate line.
<br>
To insert a line break use the br tag.
</body>
</html>

Save the document with an appropriate name and .html extension. In our case, we have named the HTML document as InsertingLineBreak.html.

Open the HTML document in Internet Explorer, as shown in below:


This is an example of inserting a line break 
This line will come in a separate line. 
To insert a line break use the br tag.

Note: The <br> tag is an empty tag, which means that it has no end tag.

Creating Headings on a Web Page

Headings define the format and structure of a document they are used to highlight important topics in document. HTML provides six heading tags: <h1>, <h2>, <h3>, <h4>, <h5>, and <h6>, where <h1> is the largest and <h6> is the smallest heading of a document. The heading tags are in pairs, with an opening tag and closing tag. Any text inside these tags is displayed differently depending on the heading number. Headings get their own line on the Web page by starting from a new line.

Let’s do the following steps to create headings on a Web page:

Open a blank document in Notepad and add the code:


<!DOCTYPE html>
<head>
<title>Create Web page Heading </title>
</head>
<body>
    <h1>This is an example of H1 heading.<h1>
    <h2>This is an example of H2 heading.<h2>
    <h3>This is an example of H3 heading.<h3>
    <h4>This is an example of H4 heading.<h4>
    <h5>This is an example of H5 heading.<h5>
    <h6>This is an example of H6 heading.<h6>
</body>
</html>

Save the document with the name Headingsin WebPage.html.

Open the HTML document in Internet Explorer, as shown in below:

This is an example of H1 heading.

This is an example of H2 heading.

This is an example of H3 heading.

This is an example of H4 heading.

This is an example of H5 heading.
This is an example of H6 heading.

HTML 5 has introduced a new tag, <hgroup>, to group the headings of a document. This tag is used to group the set of h1-h6 headings, when there are multiple headings, such as tag lines and sub headings, used on a Web page.

Let’s do the following steps to create group of headings using the <hgrop> tag on a Web pag:

Open a blank document in Notepad and add the code:


<!DOCTYPE html>
<head>
<title>Create Web page Heading </title>
</head>
<body>
    <hgroup>
    <h1>Internet and HTML<h1>
    <h2>This is an example of H2 heading.<h2>
    <h3> Learn about the web and HTML <h3>
    <h4>HTML-Hypertext markup language can be used to create a website. The files created using the
HTML scripting language can be run over the Internet<h4>
    </hgroup>
</body>
</html>

Save the document with the name HeadingGroup.html.

Open the HTML document in Internet Explorer, as shown below snapshot:

Internet and HTML

This is an example of H2 heading.

Learn about the web and HTML

HTML-Hypertext markup language can be used to create a website. The files created using the HTML scripting language can be run over the Internet

Let’s now learn to create a Paragraph in web page:go through Next Button

PRV MENU NEXT